<template>
  <div>
    <h1>cate(分类)</h1>
    <ul>
      <router-link
        :to="{ name: 'goodsitem', query: { id: item.id } }"
        v-for="(item, index) of list"
        :key="index"
      >
        <img width="100px" height="100px" :src="item.img" alt="" srcset="" />
        <h1>{{ item.name }}</h1>
        <p>{{ item.title }}</p>
      </router-link>
    </ul>
  </div>
</template>

<script>
export default {
  name: "CatePage",
  data() {
    return {
      list: [
        {
          id: 1,
          name: "鸡蛋",
          title: "我的鸡蛋又大又圆，炒起来，可香了",
          img: require("@/assets/img/1.jpg"),
          price: 10,
        },
        {
          id: 2,
          name: "鸭蛋",
          title: "我的鸭蛋又大又圆，炒起来，一般香了",
          img: require("@/assets/img/1.jpg"),
          price: 20,
        },
        {
          id: 3,
          name: "鹅蛋",
          title: "我的鹅蛋又大又圆，炒起来，不香了",
          img: require("@/assets/img/1.jpg"),
          price: 30,
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
</style>